.DottedTable {
    font-size: 15px;
    padding-right: 15px;
    padding-left: 15px;
    padding-bottom: 12px;

    ul {
        overflow-x: hidden;
        list-style: none;

        li {
            display: flex;
        }

        li:before {
            float: left;
            width: 0;
            white-space: nowrap;
            color: #fff4a97a;
            content: ". . . . . . . . . . . . . . . . . . . . " ". . . . . . . . . . . . . . . . . . . . "
                ". . . . . . . . . . . . . . . . . . . . " ". . . . . . . . . . . . . . . . . . . . "
                ". . . . . . . . . . . . . . . . . . . . " ". . . . . . . . . . . . . . . . . . . . "
                ". . . . . . . . . . . . . . . . . . . . " ". . . . . . . . . . . . . . . . . . . . "
                ". . . . . . . . . . . . . . . . . . . . " ". . . . . . . . . . . . . . . . . . . . "
                ". . . . . . . . . . . . . . . . . . . . " ". . . . . . . . . . . . . . . . . . . . "
                ". . . . . . . . . . . . . . . . . . . . " ". . . . . . . . . . . . . . . . . . . . "
                ". . . . . . . . . . . . . . . . . . . . " ". . . . . . . . . . . . . . . . . . . . "
                ". . . . . . . . . . . . . . . . . . . . " ". . . . . . . . . . . . . . . . . . . . "
                ". . . . . . . . . . . . . . . . . . . . ";
        }
    }
}

.DottedTable__label {
    padding-right: 0.33em;
    background: #22292f;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.DottedTable__value {
    float: right;
    padding-left: 0.33em;
    background: #22292f;
    display: flex;
    align-items: center;
    margin-left: auto;
    white-space: nowrap;

    img {
        margin-right: 3px;
    }
}
.DottedTable__title {
    font-weight: bold;
}
.DottedTable__separator {
    border-bottom: 1px dotted #8c8a6abf;
    margin: 15px 0;
}
